Adwaita: fix menu scroll arrows positioning

adresses the style part of
https://bugzilla.gnome.org/show_bug.cgi?id=764118

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 7724ebfd52eb816c303ac75aee9050ecafadfae6..93033abd9d8eb0fd9f9c11d95275049b727a880d 100644 (file)
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -1844,7 +1844,7 @@ menu,
       background-color: transparent;
     }
 
-    //submenu indicators
+    // submenu indicators
     arrow {
       min-height: 16px;
       min-width: 16px;
@@ -1861,26 +1861,32 @@ menu,
     }
   }
 
-  arrow { // overlow buttons
-    @extend %undecorated_button;
+  // overflow arrows
+  > arrow {
+    @include button(undecorated);
 
-    border-style: none;
-    border-radius: 0;
     min-height: 16px;
     min-width: 16px;
+    padding: 4px;
+    background-color: $menu_color;
+    border-radius: 0;
 
     &.top {
-      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
+      margin-top: -6px;
       border-bottom: 1px solid mix($fg_color, $base_color, 10%);
+      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
     }
 
     &.bottom {
-      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
+      margin-bottom: -6px;
       border-top: 1px solid mix($fg_color, $base_color, 10%);
+      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
     }
 
     &:hover { background-color: mix($fg_color, $base_color, 10%); }
 
+    &:backdrop { background-color: $backdrop_menu_color; }
+
     &:disabled {
       color: transparent;
       background-color: transparent;

diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 9a97f03e43e470358b37cfcf9776134f88c6318c..5fc2b53a2881305c95615174d7646e7f8375c428 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1284,8 +1284,7 @@ popover.background radiobutton:backdrop:hover,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
-button:visited:checked, menu arrow,
-.menu arrow, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop {
+button:visited:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop {
   background-color: transparent;
   background-image: none;
   border-color: transparent;
@@ -2158,25 +2157,37 @@ menu,
       .menu menuitem arrow:dir(rtl) {
         -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
         margin-right: 10px; }
-  menu arrow,
-  .menu arrow {
-    border-style: none;
-    border-radius: 0;
+  menu > arrow,
+  .menu > arrow {
+    border-color: transparent;
+    background-color: transparent;
+    background-image: none;
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+    text-shadow: none;
+    -gtk-icon-shadow: none;
     min-height: 16px;
-    min-width: 16px; }
-    menu arrow.top,
-    .menu arrow.top {
-      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
-      border-bottom: 1px solid #3d3d3d; }
-    menu arrow.bottom,
-    .menu arrow.bottom {
-      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
-      border-top: 1px solid #3d3d3d; }
-    menu arrow:hover,
-    .menu arrow:hover {
+    min-width: 16px;
+    padding: 4px;
+    background-color: #2c2d2d;
+    border-radius: 0; }
+    menu > arrow.top,
+    .menu > arrow.top {
+      margin-top: -6px;
+      border-bottom: 1px solid #3d3d3d;
+      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
+    menu > arrow.bottom,
+    .menu > arrow.bottom {
+      margin-bottom: -6px;
+      border-top: 1px solid #3d3d3d;
+      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
+    menu > arrow:hover,
+    .menu > arrow:hover {
       background-color: #3d3d3d; }
-    menu arrow:disabled,
-    .menu arrow:disabled {
+    menu > arrow:backdrop,
+    .menu > arrow:backdrop {
+      background-color: #2f3030; }
+    menu > arrow:disabled,
+    .menu > arrow:disabled {
       color: transparent;
       background-color: transparent;
       border-color: transparent; }

diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index d0fc8a1614df72ca2ceaf4913c73fef569d6668f..2051c31ceeb38c6ef3f357e495fdeae9841d4028 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1287,8 +1287,7 @@ popover.background radiobutton:backdrop:hover,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
-button:visited:checked, menu arrow,
-.menu arrow, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop {
+button:visited:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop {
   background-color: transparent;
   background-image: none;
   border-color: transparent;
@@ -2171,25 +2170,37 @@ menu,
       .menu menuitem arrow:dir(rtl) {
         -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
         margin-right: 10px; }
-  menu arrow,
-  .menu arrow {
-    border-style: none;
-    border-radius: 0;
+  menu > arrow,
+  .menu > arrow {
+    border-color: transparent;
+    background-color: transparent;
+    background-image: none;
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+    text-shadow: none;
+    -gtk-icon-shadow: none;
     min-height: 16px;
-    min-width: 16px; }
-    menu arrow.top,
-    .menu arrow.top {
-      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
-      border-bottom: 1px solid #eaebeb; }
-    menu arrow.bottom,
-    .menu arrow.bottom {
-      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
-      border-top: 1px solid #eaebeb; }
-    menu arrow:hover,
-    .menu arrow:hover {
+    min-width: 16px;
+    padding: 4px;
+    background-color: #ffffff;
+    border-radius: 0; }
+    menu > arrow.top,
+    .menu > arrow.top {
+      margin-top: -6px;
+      border-bottom: 1px solid #eaebeb;
+      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
+    menu > arrow.bottom,
+    .menu > arrow.bottom {
+      margin-bottom: -6px;
+      border-top: 1px solid #eaebeb;
+      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
+    menu > arrow:hover,
+    .menu > arrow:hover {
       background-color: #eaebeb; }
-    menu arrow:disabled,
-    .menu arrow:disabled {
+    menu > arrow:backdrop,
+    .menu > arrow:backdrop {
+      background-color: #fcfcfc; }
+    menu > arrow:disabled,
+    .menu > arrow:disabled {
       color: transparent;
       background-color: transparent;
       border-color: transparent; }